<template>
	<view>
		<!--pages/vipPassword/vipPassword.wxml-->
		<view class="box">
			<view class="list">
				<text class="list-left">手机号:</text>
				<view class="list-input-box">
					<input class="list-input" disabled type="text" :value="mobile" placeholder-class="pl"></input>
				</view>
			</view>
			<view class="list">
				<text class="list-left">验证码:</text>
				<view class="list-input-box list-box-height">
					<input class="list-input" type="number" placeholder="请输入验证码" maxlength="6" :value="code"
						@input="inputCode" placeholder-class="pl"></input>
				</view>
				<button v-if="!isCountDown" class="input-btn input-btn-bg" @tap="getCode">获取验证码</button>
				<button v-else class="input-btn" @tap="getCode">{{count_down}}s后重试</button>
			</view>
			<block v-if="isGetCode">
				<view class="list">
					<text class="list-left">新密码:</text>
					<view class="list-input-box">
						<input class="list-input" type="password" maxlength="6" placeholder="请输入新密码" :value="password"
							@input="inputPass" placeholder-class="pl"></input>
					</view>
				</view>
				<view class="list">
					<text class="list-left">确认密码:</text>
					<view class="list-input-box">
						<input class="list-input" type="password" maxlength="6" placeholder="再次输入密码" :value="rePass"
							@input="inputRePass" placeholder-class="pl"></input>
					</view>
				</view>
			</block>
		</view>
		<view v-if="isGetCode" class="tips">该密码为会员余额支付密码，并非微信支付密码</view>
		<view class="btn" v-if="isGetCode&&code.length==6&&password.length&&password==rePass" @tap="toSet">确认设置</view>
		<view v-else class="btn btn-disabled">确认设置</view>
	</view>
</template>

<script>
	// pages/vipPassword/vipPassword.js
	var app = getApp().globalData;

	export default {
		data() {
			return {
				isCountDown: false,
				count_down: 60,
				isGetCode: false,
				code: '',
				mobile: '',
				password: '',
				rePass: ''
			};
		},

		components: {},
		props: {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function(options) {
			var that = this;
			getApp().globalData.sendRequest({
				url: '/Vip/getVipData',
				loadTitle: '数据获取中...',
				success: function(res) {
					if (res.status == 1) {
						if (res.data.mobile_phone && res.data.mobile_phone.length) {
							that.setData({
								mobile: res.data.mobile_phone
							});
						} else {
							uni.showModal({
								title: '提示',
								content: '需先设置手机号，才能修改密码',
								showCancel: true,
								cancelText: '取消',
								confirmText: '去设置',
								confirmColor: '#ff5c6d',
								success: function(res) {
									if (res.confirm) {
										uni.navigateTo({
											url: '/pages/mine/vipInfo/vipInfo'
										});
									} else {
										uni.navigateBack({
											delta: 1
										});
									}
								}
							});
						}
					} else {
						getApp().globalData.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				}
			});
		},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function() {},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},
		methods: {
			/**
			 * 获取验证码
			 */
			getCode: function() {
				var that = this;
				var mobile = this.mobile;
				getApp().globalData.sendRequest({
					url: '/Vip/getEditCode',
					loadTitle: '发送中...',
					success: function(res) {
						if (res.status == 1) {
							uni.showToast({
								title: res.msg,
								icon: 'success',
								// #ifdef MP-ALIPAY
								duration: 1000,
								// #endif
							});
							that.setData({
								isCountDown: true,
								isGetCode: true
							});
							that.timer = setInterval(function() {
								var count_down = that.count_down;
								console.log(count_down);

								if (count_down > 1) {
									count_down = parseInt(count_down - 1);
									that.setData({
										count_down: count_down
									});
								} else {
									clearInterval(that.timer);
									that.setData({
										isCountDown: false,
										count_down: 60
									});
								}
							}, 1000);
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 1500
							});
						}
					}
				});
			},

			/**
			 * 输入验证码
			 */
			inputCode: function(e) {
				this.setData({
					code: e.detail.value
				});
			},

			/**
			 * 输入密码
			 */
			inputPass: function(e) {
				var num = e.detail.value;
				num = num.replace(/^[0]|\D/, '');
				this.setData({
					password: num
				});
			},

			/**
			 * 再次输入密码
			 */
			inputRePass: function(e) {
				var num = e.detail.value;
				num = num.replace(/^[0]|\D/, '');
				this.setData({
					rePass: num
				});
			},

			/**
			 * 确认设置密码
			 */
			toSet: function() {
				var that = this;
				getApp().globalData.sendRequest({
					url: '/Vip/reSetPassword',
					data: {
						password: that.password,
						code: that.code
					},
					success: function(res) {
						if (res.status == 1) {
							uni.showToast({
								title: res.msg,
								duration: 1000,
								mask: true,
								success: function(res) {
									setTimeout(function() {
										uni.navigateBack({
											delta: 1
										});
									}, 1000);
								}
							});
						} else {
							getApp().globalData.showToast({
								title: res.msg,
								icon: 'none',
								mask: true
							});
						}
					}
				});
			}
		}
	};
</script>
<style>
	@import "./vipPassword.css";
</style>
